<template>
  <div>
    <elm-page-tb>
      <template #top>
        <elm-row>
          <elm-org v-model="postData.org" size="mini" style="width:250px;margin: 0 10px"></elm-org>
          <el-date-picker type="date" value-format="yyyy-MM-dd" size="mini" style="width:250px;margin: 0 10px" v-model="postData.startDate" clearable></el-date-picker>
          <el-date-picker type="date" value-format="yyyy-MM-dd" size="mini" style="width:250px;margin: 0 10px" v-model="postData.endDate" clearable></el-date-picker>
          <right>
            <el-button-group>
              <el-button icon="el-icon-search" size="mini" @click="reload()">查询</el-button>
            </el-button-group>
          </right>
        </elm-row>
      </template>
      <elm-table :data="tableData" :show-index="false" :page-size="9999">
        <el-table-column type="index" label="序号" fixed="left" width="50px" align="center"></el-table-column>
        <el-table-column prop="org" label="部门名称" fixed="left" align="center" min-width="150"></el-table-column>
        <el-table-column prop="user" label="人员名称" fixed="left" align="center" width="100"></el-table-column>
        <el-table-column prop="hour" label="总时长" fixed="left" align="center" width="70"></el-table-column>
        <el-table-column v-for="item in dates" :prop="item" :label="item" align="center" min-width="200">
          <template v-slot="scope">
            {{scope.row[item]?.split('\n')[0]}}<br>{{scope.row[item]?.split('\n')[1]}}
          </template>
        </el-table-column>
      </elm-table>
    </elm-page-tb>
  </div>

</template>

<script>
export default {
  extends: elmVueBase,
  data() {
    return {
      postData: {
        org:null,
        startDate:new Date(new Date().setDate(1)).toISOString().split('T')[0],
        endDate: new Date().toISOString().split('T')[0],
      },
      dates:[],
      tableData:[],
    }
  },
  created() {
    this.reload();
  },
  methods: {
    getDatesBetween(startDate, endDate) {
      this.dates = [];
      let currentDate = new Date(endDate);
      while (currentDate >= startDate) {
        this.dates.push(currentDate.toISOString().split('T')[0]);
        currentDate.setDate(currentDate.getDate() - 1);
      }
    },
    async getData(){
      let res=await elm.post("/business/hrm/daily/show/GetData",this.postData);
      this.tableData=[];
      if(res.length>0){
        let item={org:res[0].org_mc,user:res[0].user_mc,hour:res[0].hour};
        item[res[0].create_date.toString()]="工作内容："+res[0].work.toString()+"\n工作时长："+res[0].hour.toString();
        for(let i=1;i<res.length;i++)
        {
          console.log(res,item.hour);
          if(res[i].user_mc!=item.user){
            this.tableData.push({...item});
            item={org:res[i].org_mc,user:res[i].user_mc,hour:0};
          }
          item[res[i].create_date.toString()]="工作内容："+res[i].work.toString()+"\n工作时长："+res[i].hour.toString();
          item.hour+=res[i].hour;
        }
        this.tableData.push(item);
      }
    },
    reload(){
      this.getDatesBetween(new Date(this.postData.startDate),new Date(this.postData.endDate));
      this.getData();
      this.tablebinding();
    }
  }
}
</script>